<template>
	<!-- 我的服务商 -->
	<view class="my-sqcwfws">
		<!-- tab切换 -->
		<uni-segmented-control :current="current" :values="items" :style-type="styleType" :active-color="activeColor"
			@clickItem="onClickItem" />
		<view class="content">
			<!-- 加载中效果 -->
			<uni-load-more v-if="loading" status="loading" />
			<!-- 服务商列表 -->
			<view class="provider-list" v-if="!loading && providerList.length > 0">
				<view class="provider-item" v-for="(item, index) in providerList" :key="index"
					@click="viewDetail(item)">
					<view class="row-tag-title">
						<view class="row-tag-title-left"><uni-icons type="star-filled" size="16"
								color="#AC6C17"></uni-icons>{{ item.fwsfl }}</view>
					</view>
					<view class="item-row">
						<view class="item-left">
							<image
								:src="item.qyjjXp || 'https://luntan.xiaouyf.cn/uecs-wechat/static/img/qianduan/zwxx.png'"
								mode="aspectFill"></image>
						</view>
						<view class="item-right">
							<view class="company">{{item.companyName}}</view>
							<view class="content">{{item.qyjj}}</view>
						</view>
					</view>
					<!-- 编辑、删除 -->
					<view class="row-edit-del">
						<view v-if="current !== 1" class="block-btn" @click.stop="handleEdit(item)">
							<image src="https://luntan.xiaouyf.cn/uecs-wechat/static/img/qianduan/wdfb_bj.png"
								mode="widthFix"></image> 编辑
						</view>
						<view class="block-btn" @click.stop="handleDelete(item)">
							<image src="https://luntan.xiaouyf.cn/uecs-wechat/static/img/qianduan/wdfb_sc.png"
								mode="widthFix"></image> 删除
						</view>
					</view>
				</view>
			</view>
			<!-- 暂无数据显示 -->
			<view class="zwxx-img" v-if="!loading && providerList.length === 0">
				<image src="https://luntan.xiaouyf.cn/uecs-wechat/static/img/qianduan/zwxx.png" mode="widthFix"></image>
				<view>暂无数据</view>
			</view>
		</view>
		<view class="public-btn-w sqcwfws-btn">
			<button class="public-btn" @click="toggleXzcwfws()">新增成为服务商</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				items: ['待审核', '审核通过', '审核不通过'],
				current: 0,
				styleType: 'text',
				activeColor: '#AC6C17',
				loading: false,
				// 状态映射
				statusMap: {
					0: '待审核',
					1: '审核通过',
					2: '审核不通过'
				},
				providerList: []
			}
		},
		computed: {
			userInfo() {
				return this.$store.state.user.userInfo;
			}
		},
		onShow() {
			this.init()
		},
		methods: {
			async init() {
				this.loading = true;
				try {
					// 根据当前用户ID和状态获取列表
					const res = await this.$api.getSwsList({
						createUserId: this.userInfo.guid,
						status: this.items[this.current]
					});
					if (res.succ) {
						this.providerList = res.data;
					} else {
						uni.showToast({
							title: res.msg || '获取数据失败',
							icon: 'none'
						});
					}
				} catch (error) {
					console.error('获取数据失败:', error);
					uni.showToast({
						title: '数据加载失败',
						icon: 'none'
					});
				} finally {
					this.loading = false;
				}
			},
			onClickItem(index) {
				const currentIndex = Number(index.currentIndex);
				if (this.current !== currentIndex) {
					this.current = currentIndex;
					this.init();
				}
			},
			viewDetail(item) {
				uni.navigateTo({
					url: `/pages/sqcwfws/sqcwfws?id=${item.guid}&type=view`
				});
			},
			handleEdit(item) {
				uni.navigateTo({
					url: `/pages/sqcwfws/sqcwfws?id=${item.guid}&type=edit`
				});
			},
			handleDelete(item) {
				uni.showModal({
					title: '提示',
					content: '确定要删除这条服务商信息吗？',
					success: async (res) => {
						if (res.confirm) {
							try {
								const result = await this.$api.deleteServiceInfo([item.guid]);
								if (result.succ) {
									uni.showToast({
										title: '删除成功',
										icon: 'success'
									});
									this.init();
								} else {
									uni.showToast({
										title: result.msg || '删除失败',
										icon: 'none'
									});
								}
							} catch (error) {
								console.error('删除失败:', error);
								uni.showToast({
									title: '删除失败',
									icon: 'none'
								});
							}
						}
					}
				});
			},
			// 新增成为服务商
			toggleXzcwfws() {
				if (this.userInfo.userType === '普通用户') {
					uni.showToast({
						title: '开通会员才能使用此功能',
						icon: 'none'
					});
					return;
				}
				if (this.userInfo.srStatus !== '1') {
					uni.showToast({
						title: '认证完成后才能使用此功能',
						icon: 'none'
					});
					return;
				}
				uni.navigateTo({
					url: '/pages/sqcwfws/sqcwfws'
				});
			}
		}
	}
</script>

<style lang="less">
	.my-sqcwfws {
		height: 100%;
		display: flex;
		flex-direction: column;
		background: linear-gradient(180deg, #FAEBDB 0%, rgba(255, 247, 238, 0) 500rpx);

		.segmented-control {
			position: relative;
			height: 100rpx !important;

			&::after {
				z-index: -1;
				content: '';
				position: absolute;
				left: 0;
				right: 0;
				bottom: 0;
				height: 1rpx;
			}

			.segmented-control__text {
				padding: 15px 10rpx !important;
				font-size: 32rpx !important;
			}

			.segmented-control__item--text {
				position: relative;

				&::after {
					z-index: 2;
					content: '';
					position: absolute;
					left: 10rpx;
					right: 10rpx;
					bottom: -1px;
					height: 4rpx;
					background: #AC6C17;
				}
			}
		}

		.content {
			flex: 1;
			overflow: auto;
			padding: 20rpx 30rpx 0;

			.provider-list {
				.provider-item {
					display: flex;
					flex-direction: column;
					padding: 30rpx 30rpx 10rpx;
					background-color: #FFF7EE;
					border-radius: 20rpx;
					margin-bottom: 20rpx;

					// 标签
					.row-tag-title {
						display: flex;
						align-items: center;
						justify-content: space-between;
						margin: 10rpx 0 20rpx;

						&-left {
							color: #AC6C17;
							font-size: 32rpx;

							.uni-icons {
								margin-right: 5rpx;
							}
						}

						&-right {
							font-size: 30rpx;
						}
					}

					.item-row {
						display: flex;
					}

					.item-left {
						width: 200rpx;
						height: 200rpx;
						margin-right: 20rpx;

						image {
							width: 100%;
							height: 100%;
							border-radius: 10rpx;
						}
					}

					.item-right {
						flex: 1;
						display: flex;
						flex-direction: column;
						justify-content: space-between;

						.company {
							font-size: 32rpx;
							font-weight: bold;
							color: #333;
							padding: 12rpx 0;
							margin-bottom: 10rpx;
							display: -webkit-box;
							-webkit-box-orient: vertical;
							-webkit-line-clamp: 1;
							overflow: hidden;
						}

						.content {
							font-size: 30rpx;
							color: #333;
							padding: 5rpx 0 0;
							margin-bottom: 10rpx;
							display: -webkit-box;
							-webkit-box-orient: vertical;
							-webkit-line-clamp: 3;
							overflow: hidden;
						}

						.time {
							text-align: right;
							font-size: 24rpx;
							color: #999;
							margin-bottom: 10rpx;
						}
					}

					.row-edit-del {
						display: flex;
						justify-content: flex-end;
						margin-top: 20rpx;
						padding-top: 20rpx;
						border-top: 1rpx solid #eee;

						.block-btn {
							display: flex;
							align-items: center;
							margin-left: 30rpx;
							font-size: 28rpx;
							color: #fff;

							image {
								width: 32rpx;
								margin-right: 10rpx;
							}
						}
					}
				}
			}
		}

		.sqcwfws-btn {
			margin: 0 30rpx;
		}
	}
</style>